.city_page {
    background: #fff;
    min-height: 100vh;
    margin: 20px auto;
    padding: 24px 16px;
    box-sizing: border-box;
}

.row_box {
    margin-bottom: 40px;

    .h2 {
        font-size: 16px;
        font-weight: 500;
        line-height: 16px;
        color: rgba(51, 51, 51, 1);
        margin-bottom: 16px;
    }

    .input_box {
        width: 220px;
    }

    .hot_word {
        display: flex;
        flex-wrap: wrap;

        .word {
            flex-shrink: 0;
            padding: 8px;
            border-radius: 4px;
            background: rgba(245, 245, 245, 1);
            font-size: 14px;
            font-weight: 400;
            line-height: 14px;
            color: rgba(51, 51, 51, 1);
            margin: 0 16px 16px 0;
            cursor: pointer;
        }
    }
}

.row_box:last-child {
    margin-bottom: 0;
}

.province_box {
    display: flex;

    .province {
        flex-shrink: 0;
        width: 56px;
        height: 40px;
        border-radius: 4px;
        background: rgba(245, 245, 245, 1);
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        padding: 0 4px;
        box-sizing: border-box;
        line-height: 40px;

        font-size: 16px;
        font-weight: 400;
        color: rgba(51, 51, 51, 1);

        text-align: center;
    }

    .city_box {
        display: flex;
        flex-wrap: wrap;
        margin-left: 40px;

        .cell {
            flex-shrink: 0;
            padding: 8px;
            height: 40px;
            border-radius: 4px;
            //background: rgba(245, 245, 245, 1);
            font-size: 14px;
            font-weight: 400;
            //line-height: 40px;
            color: rgba(51, 51, 51, 1);
            margin: 0 24px 24px 0;
            cursor: pointer;
        }
        .cell:hover{
            color:rgba(48, 124, 255, 1);
        }
    }
}